import React from 'react';
import { RobotOutlined } from '@ant-design/icons';

interface ExampleQuestion {
  icon: string;
  title: string;
  desc: string;
  prompt: string;
}

interface WelcomeScreenProps {
  exampleQuestions: ExampleQuestion[];
  onExampleClick: (prompt: string) => void;
}

const WelcomeScreen: React.FC<WelcomeScreenProps> = ({ exampleQuestions, onExampleClick }) => {
  return (
    <div className="welcome-container">
      <div className="welcome-title">
        <div className="logo-icon">
          <RobotOutlined />
        </div>
        <h1>您好，我是智能助手</h1>
        <p>有什么可以帮助您的吗？</p>
      </div>
      <div className="example-questions">
        {exampleQuestions.map((example, index) => (
          <div
            key={index}
            className="example-card"
            onClick={() => onExampleClick(example.prompt)}
          >
            <div className="card-icon">{example.icon}</div>
            <div className="card-title">{example.title}</div>
            <div className="card-desc">{example.desc}</div>
          </div>
        ))}
      </div>
    </div>
  );
};

export default WelcomeScreen;
